<template>
  <div class="student">
    <h1>number的值是:{{ number }}</h1>
    <button @click="add">n++</button>
    <h1>学生名称:{{ name }}</h1>
    <h1>学生性别:{{ sex }}</h1>
    <button @click="sendStudentName">点我传递学生姓名</button>
    <button @click="unbind">解绑shijian</button>
    <button @click="death">点我销毁组件实例对象vc</button>
  </div>
</template>

<script>
export default {
  name: "Student",
  data() {
    return {
      name: "陈嘉兴",
      sex: "男",
      number: 0,
    };
  },
  methods: {
    add() {
      console.log("add回调被调用了");
      this.number++;
    },
    sendStudentName() {
      this.$emit("shijian", this.name);
    },

    unbind() {
      this.$off("shijian"); //解绑组件实例的一个自定义事件
      // this.$off(['shijian','demo']);//解绑组件实例的多个自定义事件
      // this.$off(); //解绑组件实例的所有自定义事件
    },
    death() {
      this.$destroy();
    },
  },
};
</script>

<style >
.student {
  background-color: brown;
}
</style>